<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=1.0" />
<meta name="apple-mobile-web-app-capable" content="yes">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>个人中心</title>
<link rel="stylesheet" type="text/css" href="css/footer.css">
<link rel="stylesheet" type="text/css" href="https://www.maksdu.com/static/font-awesome-4.7.0/css/font-awesome.min.css">
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>

<body>
<div id="main">
    <section class="aui-flexView">
        <header class="aui-navBar aui-navBar-fixed">
            <a href="javascript:history.back(-1);" class="aui-navBar-item">
                <i class="icon icon-return" style="width:12px"></i>
            </a>
            <div class="aui-center">
                <span class="aui-center-title">个人信息</span>
            </div>
            <a href="javascript:;" class="aui-navBar-item">
                <div class="btn bound-success" @click="saveInfo" v-if="updable==true">修改</div>
            </a>
        </header>
        <section class="aui-scrollView">
            <div class="divHeight"></div>

            <div class="ps-lt">
                <a href="avator.html"><div class="lt-dsb boldw">
                    <p><i class="fa fa-user fa-fw"></i>&nbsp;头像</p>
                    <img class="small-head arr-right-nr" :src="info.headpic" :alt="info.headpic" />
                    <i class="arr-right" style="top:0.55rem"></i>
                </div></a>
                <div class="lt-dsb ">
                    <p><i class="fa fa-pencil-square-o fa-fw"></i>&nbsp;用户昵称</p>
                    <a href="nickName.html"><span class="arr-right-nr">{{ info.nickName }}</span>
                    <i class="arr-right"></i></a>
                </div>
                <div class="lt-dsb ">
                    <p><i class="fa fa-address-card fa-fw"></i>&nbsp;真实姓名</p>
                    <a href="realName.html"><span class="arr-right-nr">{{ info.realName }}</span>
                    <i class="arr-right"></i></a>
                </div>
                <div class="lt-dsb ">
                    <p><i class="fa fa-transgender fa-fw"></i>&nbsp;性别</p>
                    <a href="sex.html"><span class="arr-right-nr"><i class="fa fa-mars fa-fw male" v-if="info.sex"></i>
                        <i class="fa fa-venus fa-fw female" v-else></i></span>
                    <i class="arr-right"></i></a>
                </div>
                <div class="lt-dsb ">
                    <p><i class="fa fa-heart-o fa-fw"></i>&nbsp;兴趣爱好</p>
                    <a href="hobby.html"><span class="arr-right-nr">{{ info.hobby }}</span>
                    <i class="arr-right"></i></a>
                </div>
                <div class="lt-dsb cl-bb">
                    <p><i class="fa fa-commenting-o fa-fw"></i>&nbsp;个人描述</p>
                    <a href="description.html"><span class="arr-right-nr">{{ info.description }}</span>
                    <i class="arr-right"></i></a>
                </div>
                <div class="divHeight"></div>
                <div class="lt-dsb ">
                    <p><i class="fa fa-phone fa-fw"></i>&nbsp;手机号绑定</p>
                    <a href="javascript:"><span class="arr-right-nr bind-area" >未填写</span>
                </div>
                <div class="lt-dsb cl-bb">
                    <p><i class="fa fa-envelope-o fa-fw"></i>&nbsp;邮箱绑定</p>
                    <a href="javascript:"><span class="arr-right-nr bind-area" >未填写</span>
                </div>
            </div>
        </section>
    </section>
</div>
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
    (function (doc, win) {
     var docEl = doc.documentElement,
     resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
     recalc = function () {
       var clientWidth = docEl.clientWidth;
       if (!clientWidth) return;
       docEl.style.fontSize = 100 * (clientWidth / 750) + 'px';
     };

      if (!doc.addEventListener) return;
      win.addEventListener(resizeEvt, recalc, false);
      doc.addEventListener('DOMContentLoaded', recalc, false);
    })(document, window);

 //    $("#updateBtn").click(function(){
 //        var info = window.localStorage.getItem('myinfo');
 //        var paramData= JSON.parse(info);
 //        console.info(paramData);
        // $.ajax({
        //     url:'https://www.maksdu.com/app/userinfo/add',
        //     type: 'post',
        //     data: info,
        //     contentType : 'application/json',
        //     dataType : 'json',
        //     headers: {
        //         request_access_token: window.localStorage.getItem('token')
        //     },
        //     success: function(data) {
        //         console.info(data);
        //         if(data.code == 200) {
        //             window.localStorage.setItem('myinfo',JSON.stringify(data.result.value.userinfo));
        //         }
        //         window.localStorage.setItem('myinfoUpdate',false);
        //         window.location.reload();
        //     }
        // })
       
 //    });

	// $(function(){
 //        var userinfo = window.localStorage.getItem('myinfo');
 //        var myinfoUpdate = window.localStorage.getItem('myinfoUpdate');
 //        if(myinfoUpdate && myinfoUpdate=='update') {
 //            $("#updateBtn").show();
 //        } 
 //        if(userinfo && userinfo != 'undefine') {
 //            var userInfoObj = JSON.parse(userinfo);
 //            $.each(userInfoObj,function(attr,element){
 //                var that = $("span[v-data="+attr+"]");
 //                if(that.attr("v-type")=="boolean") {
 //                    if(element) {
 //                        that.text(that.attr("v-true"));
 //                    } else {
 //                        that.text(that.attr("v-false"));
 //                    }
 //                } else if(that.attr("v-type") == "img") 

 //                else {
 //                    if(element)
 //                        that.text(element);
 //                    else
 //                        that.text("未填写");
 //                }
 //            });
 //        }
 //    })

</script>
<script type="text/javascript" src="https://www.maksdu.com/static/js/base.js"></script>
<script type="text/javascript" src="js/info.js"></script>
</body>
</html>
